<template>
  <div>
    <ul class="module-attr-tab">
      <li
        v-for="(item, index) in tab"
        :class="cur === index ? 'on' : ''"
        @click="cur = index"
      >
        {{ item.name }}
      </li>
    </ul>
    <!--基础设置-->
    <template v-if="cur == 0">
      <div class="attr-con-item">元件设置</div>
      <div class="att-con-box">
        <div class="attr-nav-item">
          <div class="att-con-pd">
            <!-- <AttrText :text="attr.title"/> -->
          </div>
        </div>
      </div>
    </template>
    <!--样式设置-->
    <template v-if="cur == 1">
      <div class="att-con-box">
        <div class="att-con-pd">
          <!-- <AttrBase :base="attr.base" /> -->
          <div class="item">
            <div class="tit mg">背景颜色：</div>
            <div class="input">
              <el-tooltip effect="dark" content="颜色" placement="top">
                <colorPicker v-model="attr.base.bc" defaultColor="rgba(0,0,0,.3)" />
              </el-tooltip>
            </div>
          </div>
		  <!-- <div class="item">
          <div class="tit mg">文字颜色：</div>
          <div class="input">
            <div class="input-line">
              <span class="sp1"
                ><em
                  class="radio"
                  :class="attr.title.isBlack ? 'on' : ''"
                  @click="attr.title.isBlack = true"
                ></em>
                黑色</span
              >
              <span class="sp1"
                ><em
                  class="radio"
                  :class="!attr.title.isBlack ? 'on' : ''"
                  @click="attr.title.isBlack = false"
                ></em>
                白色</span
              >
            </div>
          </div>
        </div> -->
        </div>
      </div>
    </template>
  </div>
</template>

<script>
import AttrLink from "@/views/attr/link.vue";
import module from "@/util/module.js";
export default {
  name: "AttrConHead",
  props: ["attr"],
  components: {  AttrLink },
  data() {
    return {
      tab: [
        { name: "基础设置", content: "" },
        { name: "样式设置", content: "" },
      ],
      cur: 0,
    };
  },

  methods: {},
};
</script>

<style></style>
